function buildHorizontalTree(container, node, indentClass = '') {  
    const div = document.createElement('div');  
    div.classList.add('tree-node');  
    div.textContent = node.name;  
  
    if (indentClass) {  
        div.classList.add(indentClass);  
    }  
  
    container.appendChild(div);  
  
    if (node.children && node.children.length > 0) {  
        const subtreeContainer = document.createElement('div');  
        subtreeContainer.classList.add('tree', 'tree-indent'); // 添加缩进类（如果需要的话）  
  
        // 注意：这里的递归没有使用缩进类，因为横向树通常不需要缩进  
        // 如果需要模拟层级关系，可以考虑其他方式（如不同的背景色、边框等）  
        node.children.forEach(child => {  
            buildHorizontalTree(subtreeContainer, child);  
        });  
  
        if (subtreeContainer.children.length > 0) {  
            container.appendChild(subtreeContainer);  
        }  
    }  
}  
  
// 示例树形结构  
const treeData = [  
    {  
        name: '1',  
        children: [  
            { name: '1-1', children: [{ name: '1-1-1', children: [] }] },  
            { name: '1-2', children: [{ name: '1-2-1', children: [] }, { name: '1-2-2', children: [] }] },  
            { name: '1-3', children: [] }  
        ]  
    }  
];  
  
// 调用函数并传入根节点和容器  
const treeContainer = document.getElementById('tree-container');  
treeData.forEach(root => {  
    const rootContainer = document.createElement('div');  
    rootContainer.classList.add('tree');  
    buildHorizontalTree(rootContainer, root);  
    treeContainer.appendChild(rootContainer);  
});